<?php $this->beginClip('pagetitle'); ?><?php echo $merchant->name; ?><?php $this->endClip(); ?>
<style>
    *{
        -webkit-touch-callout:none;  /*系统默认菜单被禁用*/
        -webkit-user-select:none; /*webkit浏览器*/
        -khtml-user-select:none; /*早期浏览器*/
        -moz-user-select:none;/*火狐*/
        -ms-user-select:none; /*IE10*/
        user-select:none;
        font-family: Consolas;
    }
    input,textarea {
        -webkit-user-select:auto; /*webkit浏览器*/
        margin: 0px;
        padding: 0px;
        outline: none;
    }
    body{
        margin: 0px;
        background-color: rgb(247,242,248);
    }
    a{
        text-decoration:none;
    }
    button{
        margin: 0px;
        padding: 0px;
    }
    .top-store-name{
        text-align: center;
    }
    .disp {
        position: relative;
        padding: 5.5%;
    }
    .disp .disp-panel {
        display: block;
        height: 52px;
        line-height: 52px;
        font-size: 20px;
        font-weight: bold;
        letter-spacing: 1px;
        text-align: right;
        color: #333;
        border: solid 1px #dde;
        border-radius: 5px;
        background-color: #FFF;
        padding: 0 10px 0 100px;
        box-shadow: none;
        -webkit-appearance: none;
    }
    .disp .textspan {
        padding: 0 4%;
        font-size: 14px;
        color: #333;
        font-weight: bold;
        border: none;
    }

    input[disabled],input:disabled,input.disabled{
        color: #888;
        -webkit-text-fill-color:#888;
        -webkit-opacity:1;
        opacity: 1;
    }

    .disp .textspan input {
        display: inline-block;
        float: right;
        text-align: right;
        font-weight: normal;
        border: none;
        /*rgb(247,242,248)*/
        padding: 0px 0px;
        margin: 0px;
        background: none;
        width: 58%;
    }
    .container-fluid{
        /*padding-right: 15px;
        padding-left: 15px;*/
        margin-right: auto;
        margin-left: auto;
        background-color: rgb(247,242,248);
    }
    .buttom-body {
        position: fixed;
        text-align: center;
        bottom: -1px;
        width: 100%;
    }
    .keyboard {
        position: relative;
        text-align: center;
        margin-bottom: -1px;
        padding: 0 .5%;
        margin-left: -.5%;
        width: 100%;
        box-sizing: content-box;
        list-style: none;
    }
    .keyboard li {
        width: 25%;
        float: left;
        list-style:none
    }
    .keyboard li .key {
        display: block;
        box-sizing: content-box;
        width: 100%;
        height: 56px;
        line-height: 56px;
        text-align: center;
        background-color: #FFF;
        border: 1px solid #dde;
        margin-top: -1px;
        font-size: 22px;
        color: #000;
    }
    .keyboard li .key.del {
        background-image: url(/resources/frontend/images/delete-arrow2.png);
        background-position: center;
        background-repeat: no-repeat;
        background-size: 30px;
    }
    li.paysubmit {
        float: right;
    }
    li.paysubmit .key {
        font-size: 16px;
        height: 173px;
        box-sizing: border-box;
        padding: 56px 0;
        line-height: 25px;
        background-color: #FFD800;
    }
    #modal-overlay,#modal-stoppay {
        display: none;
        position: absolute;   /* 使用绝对定位或固定定位  */
        left: 0px;
        top: 0px;
        width:100%;
        height:100%;
        text-align:center;
        z-index: 1000;

        background-color: rgba(149,147,150,0.9);
    }
    .merchant_logo{
        display: inline-block;
        width: 12px;
        height: 12px;
        background: url("/resources/frontend/images/m_logo.png") no-repeat;
        background-size: 100% 100%;
    }
    .foot-desc{
        width: 80px;
        height: 14px;
        background: url("/resources/frontend/images/pvtext_log.png") no-repeat;
        background-size: 100% 100%;
        margin: 0 auto;
    }
    /* 模态框样式 */
    .modal-data{
        position: relative;
        width: 61%;
        margin: 90px auto;
        background-color:#fff;
        padding: 10px;
        border-radius: 5px;
        vertical-align: middle;
        text-align: center;
        background: url("/resources/frontend/images/code_alert.png") no-repeat;
        -webkit-background-size:cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }

    .modal-data .modal-qrcode{
        padding: 2px;
        border-radius: 10px;
        margin: 0 auto;
    }

    .modal-tips p{
        margin: 3%;
        font-size: 12px;
        font-weight: 500;
    }
    .no_redpack_res_title{
        height: 40px;
        text-align: center;
        background-color: #FED944;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        padding-top: 10px;
    }
    .no_redpack_res_body{
        padding: 40px 10px;
        font-size: 18px;
    }
    .rule_iknow{
        height: 40px;
        font-size: 16px;
        margin-top: 30px;
        border-top: 1px solid #f6f6f6;
        line-height: 40px;
    }
    .rule_tips {
        font-size: 18px;
        padding-left: 8px;
        font-weight: 500;
    }
</style>

<div class="container-fluid">
    <div id="modal-overlay">
        <div class="modal-data">

            <div>
                <div class="modal-qrcode">
                    <img style='vertical-align: middle;' width=75% src="<?= app()->params['rqcode_src']?>" alt="">
                </div>
            </div>

            <div class="modal-tips">
                <p >长按识别二维码，关注公众号</p>
                <p style="margin-top: 18%;font-size: 18px;">关注支付有<span style="font-size: 24px;color: red;font-weight: bold">红包</span></p>
                <p class="modal-close" style="font-weight: bold;margin-top:6%;color: #888;">忍痛放弃</p>
            </div>
        </div>
    </div>

    <div id="modal-stoppay">
        <div class="modal-data" style="padding: 0px; background:none;background-color:#fff;">

            <div class="no_redpack_res_title">
                <img src="/resources/frontend/images/no_redpack_des_title.png" alt="" style="width: 25px;height: 25px;margin-top: -10px;vertical-align: middle;">
                <span class="rule_tips">提示</span>
            </div>
            <div class="no_redpack_res_body">
                由于业务原因，摇钱吧的付款功能暂停，恢复时间待定
            </div>
        </div>
    </div>

    <div class="top-body">

        <div class="top-store-name">
            <div style="padding-top: 20px">
                <div style="display: inline-block; width: 14px; height: 12px; overflow: hidden; background-repeat: no-repeat; background-size: 100% 100%; background-image: url('/resources/frontend/images/m_logo.png');"></div>
                <?php echo $merchant->name; ?>
            </div>

            <?php $form = $this->beginWidget('CActiveForm', array(
                'method' => 'post',
                'action' => url('/pay/wx', array(

                )),
            )); ?>

            <div class="disp" >
                <span style="position: absolute; left: 32px; top: 37px; font-weight: bold;">订单金额</span>

                <span class="disp-panel" id="disp-panel-disp"></span>

                <input name="amount_due" id="disp-panel" maxlength="8" class="disp-panel" type="hidden" readonly="readonly" value="<?php echo $amount_due; ?>" />
                <div class="textspan redpack" style="text-align:left;margin-top: 8%; font-size: 14px; color: #888;font-weight: lighter">红包：
                    <!--                    <span style="float: right;color: #888"> 元</span>-->
                    <input type="text" style="float: right;color: #888;width: 5%;font-size: 13px" disabled value="元">
                    <input type="text" name="discount" style="font-size: 14px;color: #888" value="<?php echo $discount; ?>" disabled readonly="readonly" />
                </div>

                <div class="textspan" style="text-align:left;margin-top: 6%;">
                    实际支付：
                    <input type="text" style="float: right;color: #333;-webkit-text-fill-color: #333;width: 5%;font-size: 14px;font-weight: bold" disabled value="元">
                    <input type="text" name="amount" id="disp-panel-real" style="color: #333;-webkit-text-fill-color: #333;font-size:14px;font-weight: bold;padding-top: 0.5%;" value="<?php echo $amount; ?>" disabled readonly="readonly" />
                </div>
            </div>

            <div class="buttom-body">
                <!--
                <img src="/resources/frontend/images/pvtext_log.png" style="margin-bottom: 12px; height: 14px;" />
                 -->
                <div style="display: inline-block; width: 40%; height: 12px; margin-bottom: 12px; overflow: hidden; background-repeat: no-repeat; background-size: 100% 100%; background-image: url('/resources/frontend/images/pvtext_log.png');"></div>
                <ul class="keyboard list-unstyled clearfix">
                    <li><button type="button" class="key num" data-key="1">1</button></li>
                    <li><button type="button" class="key num" data-key="2">2</button></li>
                    <li><button type="button" class="key num" data-key="3">3</button></li>

                    <li>
                        <button type="button" class="key del" data-key="del"></button>
                    </li>

                    <li><button type="button" class="key num" data-key="4">4</button></li>
                    <li><button type="button" class="key num" data-key="5">5</button></li>
                    <li><button type="button" class="key num" data-key="6">6</button></li>
                    <li class="paysubmit"><button type="button" href="javascript: void (0);;" id="pay-btn" class="key">确认<br />支付</button></li>

                    <li><button type="button" class="key num" data-key="7">7</button></li>
                    <li><button type="button" class="key num" data-key="8">8</button></li>
                    <li style="width: calc(25% - 1px);"><button type="button" class="key num" data-key="9">9</button></li>

                    <li><button type="button" class="key num" data-key="0">0</button></li>
                    <li><button type="button" class="key num" data-key="00">00</button></li>
                    <li style="width: calc(25% - 1px);"><button type="button" href="javascript:void (0); ;" class="key num" data-key="." class="dot">.</button></li>
                </ul>
            </div>
            <?php $this->endWidget(); ?>
        </div>

    </div>
</div>
<?php $this->renderPartial('/template/payLoading')?>

<script>
    var is_jump = <?php echo $is_jump?>;

    //处理ios微信返回不刷新问题
    $(function ()
    {
        var isPageHide = false;
        window.addEventListener('pageshow', function () {
            if (isPageHide) {
                window.location.reload();
            } });
        window.addEventListener('pagehide', function () {
            isPageHide = true;
        });
    });

    //是否关注
    function isSubscribe(callback) {
        $.ajax({
            url:'/pay/isSubscribe',
            type:'post',
            dataType:'json',
            data:{id_wxplatform:"<?= $id_wxplatform?>", openid:'<?php echo $this->user->openid?>'},
            success:function (res) {
                //shi function if()
                if(typeof callback == 'function'){
                    callback(res);
                }
            }
        });
    }

    //业务逻辑
    $(document).ready(function(){

        $('#modal-stoppay').fadeIn(500);


        /*if(is_jump){
            $('#modal-overlay').fadeIn(500);
            window.sub_timer = setInterval(function(){
                isSubscribe(function(res){
                    if(res.code==200){
                        $('#modal-overlay').fadeOut(300);
                        clearInterval(window.sub_timer);
                    }
                })
            },1500);
        }*/

        $('.modal-close').click(function () {
            $('#modal-overlay').fadeOut(300);
            clearInterval(window.sub_timer);
        });

        document.oncontextmenu=function(e){
            //或者return false;
            e.preventDefault();
        };

        $('body').css({
            'background-color': '#F7F2F8'
        });

        $('#pay-btn').data('clickforbidden', false);

        var post_data = {};
        post_data.id_merchant = "<?= $id_merchant?>";
        post_data.allpay_merch = "<?= $allpay_merchantno?>";
        post_data.allpay_terminalno = "<?= $allpay_terminalno?>";

        $('#pay-btn').on('click', function(){
            var thisObj = $(this);
            if($(this).hasClass('loadding')){
                return ;
            }
            $(this).addClass('loadding');
            if(!$(this).data('clickforbidden')){

                if($('[name="amount_due"]').val() < 0.01 || isNaN($('[name="amount_due"]').val())){
                    showMsg('支付金额有误',{position:'center'});
                    $(this).removeClass('loadding');
                    return false;
                }else{
                    $(this).data('clickforbidden', true);
                    easyloading('show');

                    post_data.amount = $('input[name=amount]').val();
                    post_data.amount_due = $('input[name=amount_due]').val();
                    post_data.discount = $('input[name=discount]').val();

                    $.ajax({
                        type: 'post',
                        url: '/pay/wxpayajax',
                        data: post_data,
                        success: function(ret){
                            if(ret.result){
                                if(ret.pay_info == null){
                                    showMsg('支付成功',{position:'center'});

                                    window.location.href = '/pay/wxsuccess?id_tradedetail='+ret.id_tradedetail+'&merchant_name=<?php echo $merchant->name; ?>&id_merchant=<?php echo $merchant->id_merchant; ?>';
                                }else{
                                    WeixinJSBridge.invoke('getBrandWCPayRequest', ret.pay_info, function(res){
                                        if(res.err_msg == "get_brand_wcpay_request:ok" ){
                                            var discount = $('[name="discount"]').val();
                                            $('[name="discount"]').val(0);
                                            $('#discount-txt').text(0);

                                            showMsg('支付成功',{position:'center'});
                                            setTimeout(function(){
                                                window.location.href = '/pay/wxsuccess?id_tradedetail='+ret.id_tradedetail+'&merchant_name=<?php echo $merchant->name; ?>&id_merchant=<?php echo $merchant->id_merchant; ?>';
                                            }, 1000);

                                        }else{
                                            thisObj.removeClass('loadding');
                                            //alert(res.err_msg);
                                            /*for(var i in res){
                                                alert(i + ': ' + res[i]);
                                            }*/
                                        }
                                    });

                                }
                            }else{
                                showMsg(ret.pay_info_error,{position:'center'});
                                //$('#global-modal .modal-body').text(ret.pay_info_error);
                                //$('#global-modal').modal('show');
                            }
                            thisObj.data('clickforbidden', false);
                            easyloading('hide');
                            return ;
                        },
                        error:function(){
                            alert('网络故障,请刷新后重试');
                            easyloading('hide');
                            return ;
                        },
                        dataType: 'json'
                    });
                }
            }else{

            }
        });

        $('.keyboard .key[data-key="del"]').on('touchstart', function(e){
            e.stopPropagation();

            $(this).data('touchtimer', setInterval(function(){
                var disppanel = $('#disp-panel').val();
                var newvalue = disppanel.substr(0, disppanel.length -1);
                $('#disp-panel').val(newvalue);
                $('#disp-panel-disp').text(newvalue);
                var discount = $('[name="discount"]').val();
                var realdisppanel = newvalue - discount;
                realdisppanel = realdisppanel < 0? 0 : realdisppanel;
                $('#disp-panel-real').val(realdisppanel.toFixed(2));
            }, 100));
        }).on('touchend', function(e){
            e.stopPropagation();
            clearInterval( $(this).data('touchtimer') );
        }).on('click', function(){
            var disppanel = $('#disp-panel').val();
            var newvalue = disppanel.substr(0, disppanel.length -1);
            $('#disp-panel').val(newvalue);
            $('#disp-panel-disp').text(newvalue);
            var discount = $('[name="discount"]').val();
            var realdisppanel = newvalue - discount;
            realdisppanel = realdisppanel < 0? 0 : realdisppanel;
            $('#disp-panel-real').val(realdisppanel.toFixed(2));
        });

        $('#disp-panel-real').val('0.00');
        $('.keyboard .key.num').on('touchstart', function(e){
            e.stopPropagation();
            clearInterval( $('.keyboard .key[data-key="del"]').data('touchtimer') );

            var keyvalue = $(this).attr('data-key');
            var disppanel = $('#disp-panel').val();

            var newvalue = disppanel;
            if(typeof(keyvalue) != 'undefined'){
                if(keyvalue == '.'){
                    if(newvalue.indexOf('.') === -1 && newvalue != ''){
                        newvalue += keyvalue + '';
                    }else if(newvalue == '0' || newvalue == ''){
                        newvalue = '0.';
                    }
                }else if(keyvalue == '0' || keyvalue=='00'){
                    if(newvalue*1==0 && newvalue.length>0  && newvalue.indexOf('.') ==-1 ){

                        newvalue = '0' ;

                    }else{
                        newvalue += keyvalue + '';
                    }
                }else{
                    if(/^\d+(\.\d{2})+$/.test(newvalue)){

                    }else{
                        newvalue += keyvalue + '';
                    }
                    if(disppanel*1 ==0 && newvalue.indexOf('.') ==-1 ){
                        newvalue =keyvalue;
                    }
                }


                var discount = $('[name="discount"]').val();
                if(newvalue > 999999999){
                    $('#disp-panel').val(disppanel);
                    $('#disp-panel-disp').text(disppanel);

                    newvalue = disppanel;
                }else if(newvalue.indexOf('.') !== -1){
                    var index=newvalue.lastIndexOf(".");

                    var size=newvalue.substring(index+1,newvalue.length);

                    if((keyvalue=='0' || keyvalue=='00') && size.length>2)return;


                    $('#disp-panel').val(newvalue);
                    $('#disp-panel-disp').text(newvalue);

                }else{
                    $('#disp-panel').val(newvalue);
                    $('#disp-panel-disp').text(newvalue);

                }

                var realnewvalue = newvalue - discount;

                realnewvalue = realnewvalue < 0? 0 : realnewvalue;
                $('#disp-panel-real').val(realnewvalue.toFixed(2));
            }

            return false;
        });

        <?php if(!empty($pay_info_error)): ?>
        showMsg('<?php echo $pay_info_error; ?>','center');
        <!--$('#global-modal .modal-body').text('<?php //echo $pay_info_error; ?>');-->
        // $('#global-modal').modal('show');
        <?php endif; ?>
    });
</script>